
#chat-page{ 
//flex-basis: auto; /*宽度包裹内容*/ 
  .chat-nav{
    position: fixed;
    z-index: 99;
    width: 100%;
  }
  .chat-list{
    padding-bottom: 50px;
    padding-top: 50px;
  }
  .chat-wrap{
    background-color: #f5f5f9;
    .header-img{
      display: block;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      overflow: hidden;
    }
    .message{
      margin-top: 20px;
      max-width: calc(100% - 170px);
      white-space: pre-wrap;
      word-break: break-all;
      padding: 10px;
      border-radius: 10px;
    }
    .chat-others{
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
      .header-img{
        margin-right: 10px;
      }
      .message{
        background-color: white;
        position: relative;
      }
      
    }
    .chat-me{
      display: flex;
      justify-content: flex-end;
      align-items: flex-start;
      .message{
        background-color: #44a2e6;
        color: white;
      }
      .header-img{
        margin-left: 10px;
      }
    }
  }
  .foot-bar{
    width: 100%;
    position: fixed;
    bottom: 0;
    z-index: 99;
    display: flex;
    align-items: flex-end;
    .am-textarea-item{
      flex: 1;
      padding-right: 15px;
      border-radius: 5px;
      .am-textarea-control{
        max-height: 60px;
        overflow-y: scroll;
      }
    }
    .am-button{
      height: 44px;
      width: 80px;
    }
  }
}
